import React, { Component } from 'react'
import { Link } from 'react-router-dom'
import Content from '../common/Content'
import Page from '../common/Page'
import Empty from '../common/Empty'
import styles from './SpecialTotal.module.scss'
import api from './../../serve/api'
import { withRouter } from 'react-router-dom'

class SpecialTotal extends Component {

  constructor(props) {
    super(props)
    this.state = {
      datas: [],
      pageTotal: '',
      page: 1,
      pageSize: 15
    }
  }
  

  getCurrentPage(currentPage) {
    this.getSpecialTotal(currentPage)
  }

  componentDidMount() {
    this.getSpecialTotal(this.state.page)
  }


  async getSpecialTotal(page) {
    const data = await api.listSpecial({ page, pageSize: this.state.pageSize })
    if (data && data.code === '000000') {
      this.setState({
        page,
        datas: data.result || [],
        pageTotal: data.resultNum
      })
    }
  }

  onItem(item) {
    this.props.history.push(`/mainPage/pageDetail/special/${item.id}`)
  }

  render() {
    const { datas, page, pageTotal } = this.state
    return (
      <div className={styles.special_total_bg}>
        <div className={styles.crumbs}>
          <div className={styles.postion_div}>
            当前位置: <Link to={'/mainPage/main'}>首页</Link>> 决策专刊> <span>列表</span>
          </div>
        </div>
        <div className={styles.special_total_content_container}>
          <div className={styles.special_total_content}>
            {datas.length === 0 && <Empty title="暂无数据" />}
            {datas.length > 0 && <Content datas={datas} onItem={item => this.onItem(item)} />}
            {datas.length > 0 && <Page 
              pageConfig={{totalPage: pageTotal, pageSize: this.state.pageSize, currentPage: page }}
              pageCallbackFn={currentPage => this.getCurrentPage(currentPage)}
            />}
          </div>
        </div>
      </div>
    )
  }
}

export default withRouter(SpecialTotal)